@import 'content';
@import 'list-item';
@import 'list-item-file-details';
@import 'list-item-video';
@import 'upload-button';
@import 'upload-url';

.media-library__header {
	padding-top: 12px;
	padding-bottom: 12px;
	display: flex;
}

.dialog__content .media-library__header.card {
	box-shadow: none;
	.media-library__scale-range.range {
		top: 11px;
	}
}

.media-library__header .is-desktop {
	display: none;

	@include breakpoint( ">660px" ) {
		display: inline-block;
	}
}

.media-library__header .button {
	margin-right: 8px;
}

.media-library__header .button.media-library__upload-button {
	margin-right: 0;
	@include breakpoint( "<660px" ) {
		border-top-right-radius: 0;
		border-bottom-right-radius: 0;
	}
}
.media-library__header .button.media-library__upload-more {
	margin-left: 0;
}

.media-library__header.media-library__upload-url {
	margin-bottom: 10px;

	@include breakpoint( ">480px" ) {
		margin-bottom: 16px;
	}
}

.media-library__header-popover .popover__menu-item.is-compact {
	text-transform: none;
	font-size: 14px;
}

.media-library__filter-bar {
	display: flex;
	flex-flow: row nowrap;
	align-items: stretch;
	position: relative;

	.section-nav {
		flex: 1 auto;
		z-index: z-index( 'root', '.media-library .search.is-expanded-to-container' );
	}

	.plan-storage {
		display: none;
		margin-bottom: 9px;
		box-shadow:
		  0 0 0 1px transparentize( lighten( $gray, 20% ), .5 ),
		  0 1px 2px lighten( $gray, 30% );
		background-color: $white;
		padding-left: 24px;
		padding-right: 24px;
		box-sizing: border-box;
		flex: 1 0 auto;

		@include breakpoint( ">480px" ) {
			display: flex;
		}

		@include breakpoint( ">660px" ) {
			display: none;
		}

		@include breakpoint( ">960px" ) {
			display: flex;
			margin-bottom: 17px;
		}
	}
}

.editor-media-modal .media-library__filter-bar {
	.plan-storage {
		@include breakpoint( ">480px" ) {
			margin-bottom: 16px;
		}
	}
}

.media-library__heading {
	@include heading;
	display: inline-block;
	margin: 0;
	line-height: 40px;
	margin-right: 12px;

	@include breakpoint( "<480px" ) {
		display: none;
	}
}

.media-library__upload-buttons {
	display: inline;
}

.media-library__scale-toggle {
	position: absolute;
	right: 16px;
	&.segmented-control.is-compact .segmented-control__link {
		padding: 2px 4px;
	}

	@include breakpoint( ">480px" ) {
		display: none;
	}
}

.media-library__scale-range {
	display: none;

	@include breakpoint( ">480px" ) {
		display: block;
	}
}

.media-library__scale-toggle-label {
	@extend .screen-reader-text;
}

.media-library__scale-toggle .gridicon {
	margin: 2px 4px;
	vertical-align: middle;
}

.media-library__content .notice {
	margin-bottom: 0;
}

.media-library__list {
	padding: 0 16px;
}

.media-library__list-item.is-small .media-library__list-item-file-details .media-library__list-item-icon {
	top: 0;
}

.media-library__list-item.is-small .media-library__list-item-details-separator,
.media-library__list-item.is-small .media-library__list-item-file-extension {
	display: none;
}

.media-library__videopress-nudge-container {
	display: block;
	overflow-y: auto;
	right: 0;
	left: 0;
	margin: 0;
}

.editor-media-modal .media-library__videopress-nudge-container {
	position: absolute;
	top: 50px;
	bottom: 72px;
}

.media-library__videopress-nudge-container .upgrade-nudge-expanded {
	position: absolute;
	left: 0;
	right: 0;
	box-shadow: none;
	margin: 0;

	@include breakpoint( ">960px") {
		top: 50%;
		transform: translateY(-50%);
	}
}

.empty-content .media-library__videopress-nudge-regular.card.upgrade-nudge {
	margin-left: auto;
	margin-right: auto;
	text-align: left;
	width: 70%;
	text-decoration: none;
}
